<template>
  <div  class="big" style="text-align: center">
    <span style="font-size: 6em;margin-left: 300px;color: white;margin-top: 300px">陈益禾私人健康诊所</span>
    <el-card style="width: 400px;margin-top: 300px;background: none;float: right;margin-right: 100px;">
      <div slot="header">
        <span style="font-size: 1.5em;color: white">登录</span>
      </div>
        <el-form class="login">
          <el-form-item style="margin-right: 20px;margin-top: 30px">
            <span style="color: white">账号：</span>
            <el-input v-model="user.account" style="width: 200px"></el-input>
          </el-form-item>
          <el-form-item style="margin-right: 20px">
            <span style="color: white">密码：</span>
            <el-input v-model="user.password" type="password" style="width: 200px;margin: 0 auto"></el-input>
          </el-form-item>
          <el-form-item style="margin-left: 20px">
            <el-button @click="login" style="color: white;background: none;border: none;font-size: 20px">登录</el-button>
            <br>
            <el-button @click="$router.push('/register')" type="text" style="color: white">没有帐号？去注册</el-button>
          </el-form-item>
        </el-form>
    </el-card>
  </div>
</template>

<script>

export default {
  name: "login",
  data() {
    return {
      user: {
        account:''
      },
    }
  },
  created() {
    // localStorage.removeItem('TOKEN');
    // localStorage.removeItem('NAME');
  },
  methods: {
    login() {
      this.$axios.post('/api/user/login', this.user).then((res) => {
        console.log(res);
        if ( res.data.status === 1) {
          this.$message.success('登陆成功');
          localStorage.setItem('TOKEN',res.data.data.token);

          if (res.data.data.account==='admin'){
            this.$router.push('/AdminIndex')
          }else {
            this.$router.push('Index')
          }
        } else {
          this.$message.error('登陆失败');
        }
      })
    },
  }
}
</script>

<style scoped>
.big{
  background-image: url("../img/http___img.zcool.cn_community_01e0c959286c4ea801216a3ef0028e.jpg&refer=http___img.zcool.jpg");
  background-size: 100% 100%;
  height: 936px;
}

</style>